<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <body>

        <ui:composition template="./plantilla.xhtml">    
            <ui:define name="content">
                <f:view>
                    <h:form id="form">
                        <p:dataTable id="lista" 
                                     selection="#{controladorAdministracion_Ejemplo.personaActual}" 
                                     selectionMode="single" rowKey="#{item.idPersona}" 
                                     rowIndexVar="index"
                                     value="#{controladorAdministracion_Ejemplo.listaPersonas}" 
                                     var="item">
                            <p:ajax event="rowSelect" update=":formeditar:editapersona" 
                                    oncomplete="editDialog.show()" /> 
                            <p:column sortBy="#{index+1}">
                                <f:facet name="header">
                                    <h:outputText value="N°"/>
                                </f:facet>
                                <h:outputText value="#{index+1}"/>
                            </p:column>
                            <p:column sortBy="#{item.apellidos}" filterBy="#{item.apellidos}">
                                <f:facet name="header">
                                    <h:outputText value="Apellidos"/>
                                </f:facet>
                                <h:outputText value="#{item.apellidos}"/>
                            </p:column>
                            <p:column sortBy="#{item.nombres}" filterBy="#{item.nombres}">
                                <f:facet name="header">
                                    <h:outputText value="Nombres"/>
                                </f:facet>
                                <h:outputText value="#{item.nombres}"/>
                            </p:column>

                            <p:column sortBy="#{item.fechaNacimiento}">
                                <f:facet name="header">
                                    <h:outputText value="Fecha Nacimiento"/>
                                </f:facet>
                                <h:outputText value="#{item.fechaNacimiento}" > 
                                    <f:convertDateTime pattern="dd/MM/yyyy HH:mm" />
                                </h:outputText>
                            </p:column>

                            <p:column width="32">
                                <p:commandButton icon="ui-icon-trash" ajax="false"
                                                 action="#{controladorAdministracion_Ejemplo.IrBorrarPersona(item.idPersona)}"/>
                            </p:column>
                        </p:dataTable>
                    </h:form>
                    <h:form id="formeditar">
                        <p:dialog modal="true" widgetVar="editDialog" 
                                  header="Editar Persona" showEffect="explode" hideEffect="explode">
                            <p:panelGrid columns="2" id="editapersona">
                                <p:outputLabel value="Id:" for="id" />
                                <p:inputText id="id" value="#{controladorAdministracion_Ejemplo.personaActual.idPersona}" 
                                             title="Id" required="true" requiredMessage="El Id es Requerido."/>
                                <p:outputLabel value="Apellidos:" for="apellidos" />
                                <p:inputText id="apellidos" 
                                             value="#{controladorAdministracion_Ejemplo.personaActual.apellidos}" 
                                             title="Apellidos" />
                                 <p:outputLabel value="Nombres:" for="nombres" />
                                <p:inputText id="nombres" 
                                             value="#{controladorAdministracion_Ejemplo.personaActual.nombres}" 
                                             title="Nombres" />
                                 <p:outputLabel value="Fecha Nac:" for="fnac" />
                                <p:calendar id="fnac"  
                                            value="#{controladorAdministracion_Ejemplo.personaActual.fechaNacimiento}" 
                                            effect="fadeIn"/> 
                                <p:commandButton value="Guardar" update=":form:lista" oncomplete="editDialog.hide()"
                                                 actionListener="#{controladorAdministracion_Ejemplo.IrGuardarPersona}"/>
                            </p:panelGrid>
                        </p:dialog>
                    </h:form>
                </f:view>
            </ui:define>

            <ui:define name="left">
                Izquierda
            </ui:define>

        </ui:composition>

    </body>
</html>
